<template>
    <div class="partnerList">
        <div class="partnerList_bottom">
            <!-- <div class="partnerList_bottom_new">
				<div class="partnerList_bottom_new_goods">
					<div class="partnerList_bottom_new_goods_btn">
						<button @click="addRecommend"><i class="el-icon-trophy"></i>新增小区</button>
					</div>
				</div>
			</div> -->
            <div class="partnerList_table">
                <div class="partnerList_bottom_table">
					<table>
						<tr>
							<th></th>
							<th>ID</th>
							<th v-for="(item,index) in thItem" :key="index">{{item}}</th>
							<!-- <th v-if="tabsNum=='1'">操作</th> -->
						</tr>
						<tr v-for="(v,i) in tableList" :key="i">
							<td>
								<font class="checkbox" :class="{'check_active' : checkBoxAll.includes(i)}" @click="handlerCheckbox(i)"><i class="el-icon-check"></i></font>
							</td>
							<td>{{v.id}}</td>
							<td>{{v.outsn}}</td>
              <td>{{v.shop_name}}</td>
              <td>{{v.realname}}</td>
							<td>{{v.cash_type}}</td>
							<td>{{v.bank_name}}</td>
							<td>{{v.card_no}}</td>
							<td>{{v.mobile}}</td>
							<td>{{v.total}}</td>
							<td>{{v.amount}}</td>
							<td>{{v.fee}}</td>
              <td v-if="tabsNum!='1'">{{$moment(v.update_time*1000).format('yyyy-MM-DD HH:mm:ss')}}</td>
							<!-- <td v-if="tabsNum=='1'">
								<button class="editor" @click="toPass(v.outsn,v.card_id,1)">通过</button>
								<button class="shelves" @click="toPass(v.outsn,v.card_id,2)">拒绝</button>
							</td> -->
              <td>{{v.refund_res==0?'未通知':v.refund_res==1?'已通知':v.refund_res==2?'代付成功':v.refund_res==3?'处理中':v.refund_res==4?'代付失败':''}}</td>
              <td>{{v.refund_msg?v.refund_msg:''}}</td>
            </tr>
						<!-- <template v-if="tabsNum=='1'">
							<tr v-for="(v,i) in tableList" :key="i">
								<td>
									<font class="checkbox" :class="{'check_active' : checkBoxAll.includes(i)}" @click="handlerCheckbox(i)"><i class="el-icon-check"></i></font>
								</td>
								<td>{{v.id}}</td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td>
									<button class="editor" @click="toEditHouse(v.id)">通过</button>
									<button class="shelves" @click="toDelHouse(v.id)">拒绝</button>
								</td>
							</tr>
						</template>
						<template v-if="tabsNum=='2'">
							<tr v-for="(v,i) in tableList" :key="i">
								<td>
									<font class="checkbox" :class="{'check_active' : checkBoxAll.includes(i)}" @click="handlerCheckbox(i)"><i class="el-icon-check"></i></font>
								</td>
								<td>{{v.id}}</td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
						</template>
						<template v-if="tabsNum=='3'">
							<tr v-for="(v,i) in tableList" :key="i">
								<td>
									<font class="checkbox" :class="{'check_active' : checkBoxAll.includes(i)}" @click="handlerCheckbox(i)"><i class="el-icon-check"></i></font>
								</td>
								<td>{{v.id}}</td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
						</template> -->
						<tr v-if="tableList.length == 0"><td class="table_title" colspan="20">当前数据空空如也</td></tr>
					</table>
					<div class="partnerList_bottom_page">
						<div class="partnerList_bottom_page_left">
							<div class="partnerList_bottom_page_left_checkAll" @click="handerCheckAll">
								<font class="checkbox" :class="{'check_active' : checkAll}"><i class="el-icon-check"></i></font>
							</div>全选
							<!-- <button class="partnerList_bottom_page_left_btn" @click="selectDel">删除</button> -->
						</div>
						<div class="partnerList_bottom_page_right">
							<el-pagination
								@size-change="handleSizeChange"
								@current-change="handleCurrentChange"
								:current-page="page"
								:page-sizes="[10, 20, 30, 40]"
								:page-size="pageSize"
								layout="total, sizes, prev, pager, next, jumper"
								:total="total"
								background>
							</el-pagination>
						</div>
					</div>
				</div>
            </div>
        </div>
        
    </div>
</template>

<script>
export default {
	props:{
		thItem:{
			type:Array,
			default:['提现订单号','提现到账类型','银行名称','银行卡号','用户手机','提现总额','申请金额','申请手续费','代付结果','失败原因']
		},
		tabsNum:{
			type:String,
			default:'1'
		},
		// role:{
		// 	type:Number,
		// 	default:0
		// },
		keyword:{
			type:String,
			default:''
		},
	},
    data(){
        return{
            cateList:[],
            cate:{},
            input: '',
			checkAll:false,
			page:1,
			pageSize:10,
			total:0,
            checkBoxAll:[],				// 选中的数据
			shelvesAlls:[],
            tableList:[],
			status:1,
			role:0,
			status:0
        }
    },
	watch:{
		// role(newValue,oldValue){
		// 	console.log(newValue,oldValue,'=====');
		// 	this.role = newValue
		// 	this.getNeedList()
		// },
		// tabsNum(newValue,oldValue){
		// 	console.log(newValue,oldValue,'=====');
		// 	this.tabsNum = newValue
		// 	if(newValue=='1'){
		// 		this.status = 0
		// 	}else if(newValue=='2'){
		// 		this.status = 1
		// 	}else{
		// 		this.status = 2
		// 	}
		// 	console.log(this.status,'status');
		// 	this.getNeedList()
		// }
	},
	mounted(){

	},

    methods:{
		// 获取待审核列表
		getNeedList(role=0,status=0,staDate='',endDate='',exportNum=''){
			this.role=role
			this.status = status
			let params = {
				role,
				keyword:this.keyword,
				status,
				export:exportNum,
				sta_date:staDate,
				end_date:endDate,
        page:this.page,
        pagesize:this.pageSize
			}
			console.log(params,'获取待审核列表数据');
			if(exportNum==1){
				this.$http.exportPost('/api/root/Cashout/index',params).then(res=>{
					console.log(res,'文件导出');
					//创建一个隐藏的a连接，
					const link = document.createElement('a');
					// application/vnd.ms-excel
					let blob = new Blob([res], {type: 'application/vnd.ms-excel'});
					link.style.display = 'none';
					//设置连接
					link.href = URL.createObjectURL(blob);

					// 所属商家
					let roleText = role==1?'商家':role==2?'设计师':role==3?'施工队':'合作商';
					// 审批状态
					let statusText = status==0?'待审批':status==1?'审批通过':status==2?'被驳回':'';
					
					// 导出的表名称
					link.download = roleText+'提现'+statusText+'列表'; 
					document.body.appendChild(link);
					//模拟点击事件
					link.click();
					document.body.removeChild(link); //下载完成移除元素
        			URL.revokeObjectURL(link.href); //释放掉blob对象
				})
			}else{
				this.$http.post('/api/root/Cashout/index',params).then(res=>{
					console.log(res,'提现列表');
					if(res.code==1){
						this.tableList = res.data.list?res.data.list:[]
            this.total = res.data.total
					}
				})
			}
		},

		// 通过与拒绝按钮
		toPass(outsn,card_id,status){
			let text = status==1?'确定通过审批吗？':'确定拒绝审批吗？'
			this.$confirm(text,'提示',{
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(()=>{
				this.$http.post('/api/root/Cashout/Approval',{outsn,card_id,status}).then(res=>{
					console.log(res,'通过结果');
					if(res.code==1){
						this.$message.success(status==1?'审批通过！':'已拒绝审批！')
						this.getNeedList()
					}else{
						this.$message.warning(res.msg)
					}
				})
			}).catch(()=>{})
		},
        
          // 多选
			handlerCheckbox(i){
                console.log(i);
				let arr = this.checkBoxAll;
				if(arr.includes(i)){
					let index = arr.indexOf(i);
					if(index != -1){
						arr.splice(index,1);
						this.shelvesAlls.splice(index,1);
						if(this.checkBoxAll.length !== this.tableList.length) {
							this.checkAll = false;
						}
					}
				}else {
					this.checkBoxAll.push(i);
					this.shelvesAlls.push(this.tableList[i].id);
					if(this.checkBoxAll.length == this.tableList.length) {
						this.checkAll = true;
					}
				};
				console.log(this.shelvesAlls);
			},
            // 全选与全不选
			handerCheckAll(){
				this.checkAll = !this.checkAll;
				let arr = this.tableList.length;
				this.checkBoxAll = [];
				this.shelvesAlls = [];
				if(this.checkAll){
					for(let i=0;i<arr;i++){
						this.checkBoxAll.push(i);
					}
					this.checkBoxAll.map(v => {
					this.shelvesAlls.push(this.tableList[v].id.toString());;
				})
				}else {
					this.checkBoxAll = [];
					this.shelvesAlls = []
				}
				console.log(this.shelvesAlls);
			},

            // // 全选后的删除
            // selectDel(){
			// 	console.log(this.shelvesAlls);
			// 	let res =[...new Set(this.shelvesAlls)]; //去重
			// 	console.log(res);
			// 	let str = res.join(',');
			// 	if(this.shelvesAlls.length){
			// 		this.$confirm('此操作将删除选中项, 是否继续?', '提示', {
			// 			confirmButtonText: '确定',
			// 			cancelButtonText: '取消',
			// 			type: 'warning'
			// 		}).then(()=>{
			// 			this.$http.post('/api/root/designer/del',{id:str}).then(res=>{
			// 				console.log(res);
			// 				if(res.code==1){
			// 					this.getDesigList();
			// 					this.checkAll=false;
			// 					this.checkBoxAll=[];
			// 					this.shelvesAlls=[];
			// 					this.$message({
			// 						type:'success',
			// 						message:'删除成功'
			// 					})
			// 				}
			// 			})
			// 		})
			// 	}else{
			// 		this.$message({
			// 			type:'info',
			// 			message:'请选择要删除的项'
			// 		})
			// 	}
			// },
			

      handleSizeChange(val) {
        this.page = 1
				this.pageSize = val;
				this.getNeedList(this.role,this.status)
			},
			handleCurrentChange(val) {
			  this.page = val;
				this.getNeedList(this.role,this.status)
			},
    }
}
</script>

<style lang="less" scoped>
@import 'tablePublic.less';
</style>
